<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8" />
    <title>团购专区</title>
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <link rel="stylesheet" type="text/css" href="css/mui.min.css"/>
    <style type="text/css">
    	.scroll{
    		top: 54px;
    	}
    	.scroll ul{
    		background: none;
    		padding: 0 10px;
    	}
    	.scroll ul li{
    		background: #fff;
    		border-radius: 5px;
    		padding: 0 !important;
    		margin-top: 10px;
    	}
    	.scroll ul li a{
    		padding: 0 !important;
    		margin: 0 !important;
    	}
    	.scroll ul li a>img{
    		max-width: 140px !important;
    		height: 140px !important;
    	}
    	.scroll ul li a .mui-media-body{
    		padding: 10px 10px;
    		display: flex;
    		flex-direction: column;
    		justify-content: space-between;
    		height: 140px;
    	}
    	.cnt-bottom>div>span{
    		color: #e53e30;
    	}
    	.mui-ellipsis-2>span{
    		display: inline-block;
    		color: #e53e30;
		    font-size: 0.7em;
			border: 1px solid #e53e30;
			border-radius: 3px;
			padding: 0 3px;
    	}
    	.mui-table-view:after,
    	.mui-table-view:before{
    		background: none;
    	}
    </style>
</head>
<body>
	
	<header class="mui-bar mui-bar-nav">
		<a href="javascript:history.go(-1)" class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
		<h1 class="mui-title">团购专区</h1>
	</header>
    
    <div class="mui-content">
		
		<div class="mui-scroll-wrapper scroll">
		    <div class="mui-scroll">
		        
		        <ul class="mui-table-view">
		            <li class="mui-table-view-cell mui-media">
		                <a href="group_goods.html">
		                    <img class="mui-media-object mui-pull-left" src="img/1547977964a.jpg">
		                    <div class="mui-media-body">
		                    	<div class="mui-ellipsis-2"><span>5人团</span>【雷猫】印尼进口天然椰子水</div>
		                    	<div class="cnt-bottom">
		                    		<div>团购价：<span>￥16.00</span></div>
		                    		<p>原价：<span>￥36.00</span></p>
		                    	</div>
		                    </div>
		                </a>
		            </li>
		            <li class="mui-table-view-cell mui-media">
		                <a href="group_goods.html">
		                    <img class="mui-media-object mui-pull-left" src="img/1547977964a.jpg">
		                    <div class="mui-media-body">
		                    	<div class="mui-ellipsis-2"><span>5人团</span>【雷猫】印尼进口天然椰子水</div>
		                    	<div class="cnt-bottom">
		                    		<div>团购价：<span>￥16.00</span></div>
		                    		<p>原价：<span>￥36.00</span></p>
		                    	</div>
		                    </div>
		                </a>
		            </li>
		            <li class="mui-table-view-cell mui-media">
		                <a href="group_goods.html">
		                    <img class="mui-media-object mui-pull-left" src="img/1547977964a.jpg">
		                    <div class="mui-media-body">
		                    	<div class="mui-ellipsis-2"><span>5人团</span>【雷猫】印尼进口天然椰子水</div>
		                    	<div class="cnt-bottom">
		                    		<div>团购价：<span>￥16.00</span></div>
		                    		<p>原价：<span>￥36.00</span></p>
		                    	</div>
		                    </div>
		                </a>
		            </li>
		            <li class="mui-table-view-cell mui-media">
		                <a href="group_goods.html">
		                    <img class="mui-media-object mui-pull-left" src="img/1547977964a.jpg">
		                    <div class="mui-media-body">
		                    	<div class="mui-ellipsis-2"><span>5人团</span>【雷猫】印尼进口天然椰子水</div>
		                    	<div class="cnt-bottom">
		                    		<div>团购价：<span>￥16.00</span></div>
		                    		<p>原价：<span>￥36.00</span></p>
		                    	</div>
		                    </div>
		                </a>
		            </li>
		        </ul>
		    </div>
		</div>
		
    </div>    
    
    <script src="js/jquery-3.3.1.min.js" type="text/javascript" charset="utf-8"></script>
    <script src="js/mui.min.js" type="text/javascript" charset="utf-8"></script>
    <script type="text/javascript">
    	mui.init()
    	//初始化滚动区域
		mui('.mui-scroll-wrapper').scroll({
			deceleration: 0.0005, //flick 减速系数，系数越大，滚动速度越慢，滚动距离越小，默认值0.0006
			indicators: false,
		})
    </script>
</body>
</html>
